<script>
    $(document).on('ready', function() {
        $("#footercarrito").hide();
        $(".loginbutton").button();

        //DECLARACION DIALOG DIV AGREGAR
        $("#divuser").dialog({
            height: 'auto',
            width: 'auto',
            autoOpen: false,
            modal: true,
            show: {
                effect: "blind",
                duration: 300
            },
            hide: {
                effect: "blind",
                duration: 300
            }
        }).css("font-size", "15px", "width", "auto");
        $('#divproducto').submit(function(e) {
            e.preventDefault();
        });
        /****************************************************/
        //DECLARACION DIALOG login
        $("#logindiv").dialog({
            height: 'auto',
            width: '300',
            autoOpen: false,
            modal: true,
            show: {
                effect: "blind",
                duration: 300
            },
            hide: {
                effect: "blind",
                duration: 300
            }
        }).css("font-size", "15px", "width", "auto");
        $('#logindiv').submit(function(e) {
            e.preventDefault();
        });
        //*********************************************************
        //GUARDAR USUARIO
        /****************************************************/
        $("#proguser").hide();
        $('#divuser').submit(function(e) {
            e.preventDefault();
        });
        //OPEN DIV NUEVO USUARIO BUTTON
        //-----------------------------------
        $("#registrarse").click(function() {
            $("#formuser").trigger("reset");
            $("#userfile").val("");
            $("#respuesta").html("");
            $("#divuser").dialog("open");

        });

        /****************************************************/
        //SELECCION DE IMAGENES AGREGAR 
        $('#userfile').change(function() {
            var fileName = $('#userfile').val();
            var clean = fileName.split('\\').pop(); // clean from C:\fakepath OR C:\fake_path 
            $("#filenameusu").val(clean);

        });

        /************************************************/

        /********************CARRITO*******************************/
        /*********************************************************/
        carrito();

    });
//VER CARRITO
    function carrito() {
        var total = 0;
        var precio = 0;
        var cantidad = 0;
        var subtotal = 0;

        $.ajax({
            beforeSend: function() {
                $('.status').html("<center><img src='/ecomerce/css/img/ajax_small.gif' /><center>");
            },
            url: 'http://localhost:26/ecomerce/Productos/carrito',
            dataType: 'json',
            success: function(data) {
                var tabla = "";
                if ((data != null) && (data != "")) {
                    tabla += "<table id=tabladetalle><tr><th>Cod</th><th>Producto</th><th>Precio</th><th>Cant.</th><th>Subtotal</th></tr>";
                    $.each(data, function(item2) {
                        precio = data[item2].Precio;
                        cantidad = data[item2].Cantidad;
                        subtotal = precio * cantidad;
                        total += subtotal;
                        tabla += '<tr>';

                        tabla += '<td id="codtd">' + data[item2].Id + '</td>';
                        tabla += '<td id="productotd">' + data[item2].Producto + '</td>';
                        tabla += '<td id="preciotd">' + data[item2].Precio + '</td>';
                        tabla += '<td id="cantidadtd"><input data-id=' + data[item2].Id + ' type="number" step="1" min="1" max="99" class="cant" value=' + data[item2].Cantidad + ' /><button data-id=' + data[item2].Id + ' class="borrarcarrito">Eliminar</button></p></td>';
                        tabla += '<td id="subtotaltd">' + subtotal + '</td>';
                        tabla += '</tr>';

                    });
                    $("#footercarrito").show();
                } else {
                    $("#footercarrito").hide();
                    tabla = '<center><article class="productocarritodetalle"><h2>No hay productos en el carro</h2></article></center>';
                }
                $("#divcarrito").html(tabla);
                $("#totalcarritodetalle").html("Total: $" + total);
                $("#totalinput").val(total);

            }
        });

    }

    function esdecimal(n) {
        return n % 1 == 0;
    }
//CAMBIAR CANTIDAD PRODUCTO DEL CARRO
    $(document).on("change", ".cant", function(e) {

        var idpro = $(this).attr('data-id');
        var cantidad = $(this).val();
        if (esdecimal(cantidad)) {
            $('#totalcarritodetalle').html("<img src='/ecomerce/css/img/ajax_small.gif' />");
            $.post('http://localhost:26/ecomerce/Productos/cantidadcarrito/' + idpro + '/' + cantidad, function() {
                carrito();
            });
        }
    });
//ELIMINAR PRODUCTOS DEL CARRO
    $(document).on("click", ".borrarcarrito", function() {

        var total = 0;
        var idpro = $(this).attr('data-id');
        carritolist = '';
        var precio = 0;
        var cantidad = 0;
        var subtotal = 0;

        $.ajax({
            beforeSend: function() {
                $('#divcarrito').append("<center><img src='/ecomerce/css/img/ajax_small.gif'></center>");
                $('#totalcarritodetalle').html("<img src='/ecomerce/css/img/ajax_small.gif' />");
            },
            url: 'http://localhost:26/ecomerce/Productos/eliminarproductocarro/' + idpro,
            dataType: 'json',
            success: function(data) {
                var tabla = "";
                if (data != "") {
                    tabla += "<table id=tabladetalle><tr><th>Cod</th><th>Producto</th><th>Precio</th><th>Cant.</th><th>Subtotal</th></tr>";
                    $.each(data, function(item2) {
                        precio = data[item2].Precio;
                        cantidad = data[item2].Cantidad;
                        subtotal = precio * cantidad;
                        total += subtotal;
                        tabla += '<tr>';

                        tabla += '<td id="codtd">' + data[item2].Id + '</td>';
                        tabla += '<td id="productotd">' + data[item2].Producto + '</td>';
                        tabla += '<td id="preciotd">' + data[item2].Precio + '</td>';
                        tabla += '<td id="cantidadtd"><input data-id=' + data[item2].Id + ' type="number" step="1" min="1" max="99" class="cant" value=' + data[item2].Cantidad + ' /><button data-id=' + data[item2].Id + ' class="borrarcarrito">Eliminar</button></p></td>';
                        tabla += '<td id="subtotaltd">' + subtotal + '</td>';
                        tabla += '</tr>';
                    });
                    $("#divcarrito").html(tabla);
                    $("#totalcarritodetalle").html("Total: $" + total);
                    $("#totalinput").val(total);
                } else {

                    tabla = '<center><article class="productocarritodetalle"><h2>No hay productos en el carro</h2></article></center>';
                    $("#footercarrito").hide();
                }
                $("#divcarrito").html(tabla);
                $("#totalcarritodetalle").html("Total: $" + total);
                $("#totalinput").val(total);
            },
            error: function() {

            }
        });
    });


    $(document).on("click", "#comprardetalle", function() {
        var total = $("#totalinput").val();
        $("#totalventa").val(total);
        $.ajax({
            url: "http://localhost:26/ecomerce/ventas/add",
            type: "POST",
            success: function(n) {

            }
        });
    });
    //OPEN LOGIN    
    $(document).on("click", "#loginbutton", function() {

        $("#logindiv").dialog("open");

    });


    //OPEN LOGIN    

    //CANCEL LOGIN   
    $(document).on("click", "#cancel", function() {
        $("#logindiv").dialog("close");
    });
    //CLICK DENTRO DEL DIALOG LOGIN
    $(document).on("click", "#entrar", function(e) {

    });

    function login() {
        e.preventDefault();
        $.ajax({
            url: "http://localhost:26/ecomerce/users/loguear",
            type: "POST",
            dataType: 'json',
            data: $("#formlogin").serialize(),
            success: function(data) {
                if (data == 0) {
                    alert("Debe llenar ambos campos");
                } else if (data == 1) {
                    alert("Usuario y/o contraseña no existen");
                } else if (data == 2) {
                    alert("Usuario no habilitado");
                } else if (data.Tipo == "admin") {
                    alert("Bienvenido, ahora puedes comprar");
                    window.location.href = "http://localhost:26/ecomerce/productos/detallecarrito";
                    $("#logindiv").dialog("close");
                } else if (data.Tipo == "cliente") {
                    window.location.href = "http://localhost:26/ecomerce/productos/detallecarrito";
                    alert("Bienvenido,ahora puedes comprar");
                    $("#logindiv").dialog("close");
                }

            },
            error: function() {
                alert("No se pudo loguear");
            }
        });
    }

</script>
<script>
    $(document).on('ready', function() {

        //*********************************************************
        //GUARDAR USUARIO
        /****************************************************/
        $("#proguser").hide();

        $('#divuser').submit(function(e) {
            e.preventDefault();
        });
        

        //OPEN DIV NUEVO USUARIO BUTTON
        //-----------------------------------
        $("#adddivusuarios").click(function() {
            $("#formuser").trigger("reset");
            $("#userfile").val("");
            $("#respuesta").html("");
            $("#divuser").dialog("open");

        });
        /****************************************************/
        //GUARDAR USER BUTTON ADD DIALOG
        $("#subiruser").click(function() {

            //if ((confirmar) && (usug) &&  (pasg) && (rutg) && (nomg) && (patg) && (matg) && (emag) ){
            if (confirmar && usug && pasg && rutg && nomg && patg && matg && emag) {


                var file = $("#filenameusu").val();
                if ((file) == "") {
                    $("#filenameusu").val("default.jpg");
                }
                var rutu = $("#rut").val();
                var emailm = $("#email").val();
                $("#rutmsj").val(rutu);
                $("#emailmsj").val(emailm);

                $.ajax({
                    url: "http://localhost:26/ecomerce/users/add",
                    type: "POST",
                    data: $("#formuser").serialize(),
                    success: function() {
                        if ($("#userfile").val()) {
                            $.ajax({
                                url: "http://localhost:26/ecomerce/mensajes/send",
                                type: "POST",
                                data: $("#sendmsj").serialize(),
                                beforeSend: function() {
                                    $('#gifenviar').html("Enviando correo para activar su cuenta... <img src='/ecomerce/css/img/ajax_small.gif'/>");
                                },
                                success: function(data) {
                                    $('#gifenviar').html("Correo enviado, por favor siga el link del correo para activar su cuenta ");
                                    $("#divuser").dialog("close");
                                }
                            });

                            //$("#proguser").show();
                            //LUEGO DE AGREGAR AL USUARIO SE SUBE LA IMAGEN CORRESPONDIENTE
                            $("#userfile").upload("http://localhost:26/ecomerce/users/subirimagen", function(e) {
                                // $("#respuesta").html(e);

                                //  $("#divuser").dialog("close");
                                //  window.location.href = "http://localhost:26/ecomerce/users/login";
                                //  $("#proguser").hide();
                            }, $("#proguser"));

                        } else {

                            $.ajax({
                                url: "http://localhost:26/ecomerce/mensajes/send",
                                type: "POST",
                                data: $("#sendmsj").serialize(),
                                beforeSend: function() {
                                    $('#gifenviar').html("Enviando correo de registro<img src='/ecomerce/css/img/ajax_small.gif'/>");
                                },
                                success: function(data) {
                                    $("#formuser").trigger("reset");
                                    $('#gifenviar').html("Correo enviado");
                                    window.location.href = "http://localhost:26/ecomerce/users/login";
                                }
                            });
                        }
                    },
                    error: function() {
                        alert("No fue agregado");
                    }
                });
            } else {
                alert("Procure llenar todos los campos correctamente");
            }
        });
        /****************************************************/
        /****************************************************/
        //SELECCION DE IMAGENES AGREGAR 
        $('#userfile').change(function() {
            var fileName = $('#userfile').val();
            var clean = fileName.split('\\').pop(); // clean from C:\fakepath OR C:\fake_path 
            $("#filenameusu").val(clean);

        });
        confirmar = false;
        usug = false;
        pasg = false;
        rutg = false;
        nomg = false;
        patg = false;
        matg = false;
        emag = false;
        /************************************************/
        $("#confirmar").blur(function() {
            var pass = $("#password").val();
            var conf = $("#confirmar").val();
            if (pass !== conf) {
                alert("Password no coinciden");
                $("#confirmar").val("");
                confirmar = false;
            } else {
                confirmar = true;
            }
        });


        $("#username").blur(function() {

            var us = $("#username").val();

            if (us) {
                usug = true;
                $.ajax({
                    url: "http://localhost:26/ecomerce/users/checkuser",
                    type: "POST",
                    dataType: 'json',
                    data: {Id: us},
                    beforeSend: function() {
                        $('#load').html("<img src='/ecomerce/css/img/ajax_small.gif'/>");
                    },
                    success: function(data) {
                        if (data === 0) {
                            $('#load').html("Disponible");
                            usug = true;
                        } else {
                             $('#load').html("Usuario ya existe");
                            usug = false;
                        }
                    }
                });

            } else {
                $('#load').html("Campo obligatorio");
                usug = false;
            }
        });
        $("#password").blur(function() {
            if ($("#password").val() == "") {
                $("#passe").html("Campo obligatorio");
                pasg = false;
            }
            else {
                $("#passe").html("");
                pasg = true;
            }
        });
        $("#rut").blur(function() {
            if ($("#rut").val() == "") {
                $("#rute").html("Campo obligatorio");
                rutg = false;
            } else {
                $("#rute").html("");
                rutg = true;
            }
        });
        $("#nombre").blur(function() {
            if ($("#nombre").val() == "") {
                $("#nome").html("Campo obligatorio");
                nomg = false;
            } else {
                $("#nome").html("");
                nomg = true;
            }
        });
        $("#apellidopaterno").blur(function() {
            if ($("#apellidopaterno").val() == "") {
                $("#apee").html("Campo obligatorio");
                patg = false;
            } else {
                $("#apee").html("");
                patg = true;
            }
        });
        $("#apellidomaterno").blur(function() {
            if ($("#apellidomaterno").val() == "") {
                $("#apem").html("Campo obligatorio");
                matg = false;
            } else {
                $("#apem").html("");
                matg = true;
            }
        });
        $("#email").blur(function() {
            if ($("#email").val() == "") {
                $("#emae").html("Campo obligatorio");
                emag = false;
            } else {
                $("#emae").html("");
                var emailcomp = $("#email").val();
                if (!validateEmail(emailcomp)) {
                    emag = false;
                    $("#emae").html("Email no valido");
                } else {
                    emag = true;
                    $("#emae").html("Email aparentemente valido");
                }

            }
        });
        function validateEmail($email) {
            var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
            if (!emailReg.test($email)) {
                return false;
            } else {
                return true;
            }
        }

    });
</script>
<!--carrito -->
<div id="carrito">
    <div id="tilulo_carro">
        <img id="img" src="/ecomerce/files/cart.ico" height="50px" width="50px">
        <p class="namepcarr">Carrito de compras</p>
    </div>

    <div id="divcarrito">

        <div class="status"></div>  

    </div>
    <div id="totalcarritodetalle" ></div>
    <div id=footercarrito>
        <?php if (!$this->Session->check('user')): ?>
            <button id="registrarse" class="boton" >Registrarse</button>
            <button id="loginbutton" class="boton" >Login</button>
        <?php endif; ?>   
        <?php if ($this->Session->check('user')): ?>
            <form id="formpagomaster" action="https://www.pagomaster.com/cl/cuenta/?cmd=checkout2"  method="post">
                <input type=hidden name="merchantAccount" value="johnzon_warning420@hotmail.com">
                <input id="totalventa" type=hidden name="amount" value="precio">
                <input type=hidden name="currency" value="CLP">
                <input type=hidden name="item_id" value="carrito">
                <input type=hidden name="setupFee" value="">
                <input type=hidden name="return_url" value="">
                <input type=hidden name="cancel_url" value="http://localhost:26/ecomerce/users/cancelado">
                <input type=hidden name="stopNumber" value="">
                <input type=hidden name="stopRecurring" value="">
                <input type=hidden name="durationType" value="">
                <input type=hidden name="duration" value="">
                <input type=hidden name="merchant_logo" value="http://">
                <input type=hidden name="addresscheckoutstep" value="0">
                <input type=hidden name="additionalinfocheckoutstep" value="1">
                <input id="nomcomprador" type=hidden name="namesbuyer" value="<?php echo $_SESSION['user'][0]['Nombre']; ?>">
                <input id="apellidocomprador" type=hidden name="lastnamesbuyer" value="<?php echo $_SESSION['user'][0]['ApPaterno']; ?>">
                <input id="emailcomprador" type=hidden name="emailbuyer" value="<?php echo $_SESSION['user'][0]['Email']; ?>">
                <input type=hidden name="reselleraccount" value="">
                <input type=hidden name="ccSubscription" value="">
                <input type=hidden name="pst" value="1">
                <input type=hidden name="ipk" value="1">
                <button id=comprardetalle name="cartImage"><img src="https://www.pagomaster.com/cl/cuenta/buttons/singleitems/boton_6_comprar.png"></button>

            </form>



            <input type=hidden id="totalinput">
        <?php endif; ?>  
    </div>

</div>
<!-- AGREGAR USUARIOS -->
<!-- AGREGAR USUARIOS -->
<br><br>
<hr>
<div id="divuser" class="ocho" title="Registro de usuario">
    <div id="stylizeds" class="fieldform">
        <form id="formuser" method="POST" class="myform">
            <label>Usuario</label> <input id="username" class="fieldform" type="text" name="username" required ><span id="load"></span><br>
            <label>Clave:</label> <input id="password" class="fieldform" type="password" name="password" required ><span id="passe"></span><br>
            <label>confirmar Cave:</label> <input id="confirmar" class="fieldform" type="password" required ><span id="confe"></span><br>
            <input id="tipo" class="fieldform" type="hidden" name="tipo" value="cliente">      
            <label>Rut:</label> <input id="rut" class="fieldform" type="text" name="rut" required ><span id="rute"></span><br>
            <label>Nombre:</label> <input id="nombre" class="fieldform" type="text" name="nombre" required ><span id="nome"></span><br>
            <label>A Paterno:</label> <input id="apellidopaterno" class="fieldform" type="text" name="apellidoPaterno" required ><span id="apee"></span><br>
            <label>A Materno:</label> <input id="apellidomaterno" class="fieldform" type="text" name="apellidoMaterno" required ><span id="apem"></span><br>
            <label>email:</label> <input id="email" class="fieldform" type="email" name="email" required ><span id="emae"></span><br>
            <input id="filenameusu"  type="hidden" name="filename" >
            <input id="dirusu" type="hidden" name="dir" value="img\uploads\categoria\filename">
        </form></div>

    <center> <label> Avatar: </label><input type="file" id="userfile" name="userfile" accept="image/*" required /></center>
    <p><progress id="proguser" value="0" min="0" max="100"></progress></p>
    <div id="respuesta"></div><br><br>
    <center><button id="subiruser">Guardar</button></center>
    <br>
    

    <form id="sendmsj" method="POST">
        <input id="rutmsj" class="fieldform" type="hidden" name="rutusu"><br>
        <input id="emailmsj" class="fieldform" type="hidden" name="emailusu"><br>
    </form>
    <div id="gifenviar"></div>
</div>


    <hr>